<!DOCTYPE html>
<HTML>
<HEAD>
	<TITLE> ZTREE DEMO - big data async</TITLE>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8">
	<link rel="stylesheet" href="../css/demo.css" type="text/css">
	<link rel="stylesheet" href="../css/zTreeStyle/zTreeStyle.css" type="text/css">
	<!-- <script type="text/javascript" src="../js/jquery-1.4.4.min.js"></script> -->
	<script type="text/javascript" src="../js/jquery-1.7.2.js"></script>
	<script type="text/javascript" src="../js/jquery.ztree.core.js"></script>
	<script type="text/javascript" src="../js/jquery.ztree.excheck.min.js"></script>
	<script type="text/javascript" src="../js/jquery.ztree.exedit.min.js"></script>
	<SCRIPT type="text/javascript">
		<!--
		var setting = {
			 //check: {
            //    enable: true
            //},
            view: {
                dblClickExpand: false,
                showLine: false
            },
            data: {
                key: {
                    title: "t"
                },
                simpleData: {
                    enable: true
                    //checked: true
                }
            },
            callback: {
                onClick: onClick,
                onExpand: expandNextLayerNodes,
            }
		};

		 function onClick(e, treeId, treeNode){
		 	console.log(treeNode);
		 }

		 function expandNextLayerNodes(e, treeId, treeNode){
		 	 // console.log(e);
		 	 // console.log(treeId); // 树的dom id
		 	 // console.log(treeNode);// 当前被点击的树的节点对象
		 	 //对于获取的数据执行相关的操作，如：绑定、显示等
             var treeObj = $.fn.zTree.getZTreeObj('treeDemo');
             // console.log(treeObj);
             // 本地开发环境
             // var url = "http://localhost:8080/bgsys168/miNetworkIndex/tree/expand";
             var url = "http://121.201.19.239:8080/bgsys168/miNetworkIndex/tree/expand";
	    	 $.ajax({
	            type: 'Get',
	            url: url,
	            data:{"currentNodeNo":treeNode.id,"currentLinkLayer":Number(treeNode.layer),"rootLayer":"2"},
	            dataType: "jsonp",
	            jsonp: "callback",
	            success: function (data) {
	            	console.log(data);
	            	console.log(JSON.stringify(data.data));
	            	var targetArr = new Array();
	            	var arr = data.data;
	            	for (var i = 0; i < arr.length; i ++) {
	            		// console.log("==arr[i]==");
	            		// console.log(arr[i].id);
	            		var node = treeObj.getNodeByParam("id",arr[i].id);
	            		// console.log("==node==");
	            		// console.log(node);
	            		if (!node) {
	            			targetArr.push(arr[i]);
	            		}
	            	}
	                treeObj.addNodes(treeNode,0,targetArr,true);

	            },
	            error: function (msg) {

	                alert(" 数据加载失败！" + msg);
	            }
	        });

		 }

	   /* $(document).ready(function(){
	    	var url = "http://localhost:8080/bgsys168/miNetworkIndex/tree/init";
	    	var currentNodeNo = "zd1358";
	    	$.ajax({
	            type: 'Get',
	            url: url,
	            data:{"currentNodeNo":currentNodeNo},
	            dataType: "jsonp",
	            jsonp: "callback",
	            success: function (data) {
	            	console.log(data);
	            	console.log(JSON.stringify(data.data));
	                $.fn.zTree.init($("#treeDemo"), setting, data.data);

	            },
	            error: function (msg) {

	                alert(" 数据加载失败！" + msg);
	            }
	        });
		});*/

	    function initTree(){
	    	var currentNodeNo = $("#memberNo").val();// zd1358
	    	var layer = $("#layer").val();// 代数的限制由前端本地缓存来限制，每个节点有当前代数的字段，如果刚好相等，则不允许查询.
	    	// 本地开发环境
	    	// var url = "http://localhost:8080/bgsys168/miNetworkIndex/tree/init";
	    	// 测试环境
	    	var url = "http://121.201.19.239:8080/bgsys168/miNetworkIndex/tree/init";
	    	$.ajax({
	            type: 'Get',
	            url: url,
	            data:{"currentNodeNo":currentNodeNo},
	            dataType: "jsonp",
	            jsonp: "callback",
	            success: function (data) {
	            	console.log(data);
	            	console.log(JSON.stringify(data.data));
	                $.fn.zTree.init($("#treeDemo"), setting, data.data);

	            },
	            error: function (msg) {

	                alert(" 数据加载失败！" + msg);
	            }
	        });
	    }

		//-->
	</SCRIPT>
 </HEAD>

<BODY>
<h1>分批异步加载大数据量</h1>
<h6>[ 文件路径: bigdata/diy_async.html ]</h6>
会员编号:<input id="memberNo" type="text" value="zd1358"/>
代数:<input id="layer" type="text"/>
<input type="button" value="查询" onclick="initTree()" />
<div class="content_wrap">
	<div class="zTreeDemoBackground left">
		<ul>
			<li class="highlight_red">&nbsp;&nbsp;&nbsp;&nbsp;此 Demo 专门用于测试分批异步加载，每次展开节点都要重新进行异步加载。</li>
		</ul>
		<ul id="treeDemo" class="ztree"></ul>
	</div>

</div>
</BODY>
</HTML>
